@charset "utf-8";


@import "common/common";


.web{
    section{
        padding: r(40px) r(29px) 0px r(29px);
        h2{
            font-size: r(30px);
            margin-bottom: r(4px);
        }
        .number,.timer{
            text-align: right;
            color: $c5;
            font-size: r(20px);
            span:first-of-type{
                display: inline-block;
                margin-right: r(40px);
            }
            i{
                font-size: r(20px);
            }
        }
        .timer{
            font-size: r(22px);
            margin-bottom: r(40px);
            span:last-of-type{
                margin-left: r(-20px);
                color: $b2;
            }
        }
        p{
           text-indent: r(40px); 
           font-size: r(20px);
           line-height:r(34px); 
           @include textover2;
           &:nth-of-type(odd){
              color: #8b8b8b; 
              -webkit-line-clamp:8 ;
           }
           &:nth-of-type(even){
               font-weight: blod;
               margin:r(20px) 0px ;
               -webkit-line-clamp:2 ;
           }
        }
        /*图片包裹div*/
        .p_img{
            width: 100%;
            @include imgoverflow;
            margin-top: r(10px);
        }
        .text{
            margin-top: r(15px);
            p{
                text-indent: 0px;
                color: $c5; 
                margin: 0;
            }
        }
        .s_abstract{
            h4{
                margin-top: r(28px);
            }
            p{
                color: $c5;
                text-indent: 0px;
                margin-top: r(28px);
            }
        }
        /*文章链接*/
        .article_href{
            border-top: r(19px) solid #efefef;
            border-bottom: r(19px) solid #efefef;
            margin: r(50px) r(-29px) 0px;
            padding: r(29px);
            span{
               color: #727171;
               font-weight: blod; 
               font-size: r(21px);
            }
            a{
                color:#727171 ;
                font-size: r(18px);
            }
        }
        /**分享等功能按钮**/
        .article_btn{
            height: r(188px);
            text-align: center;
            line-height: r(188px);
            div{
               display: inline-block;
               font-size: r(20px);
               color: $b8;
               margin-left: r(54px);
               line-height:r(35px); 
               vertical-align: middle;
               &:first-of-type{
                   margin-left: 0;
               }
               span{
//                 line-height:r(16px) ;
               }
               button{
                   display: block;
                   width: r(72px);
                   height: r(72px);
                   line-height: r(65px);
                   border: 2px solid $b8;
                   border-radius: 50%;
                   text-align: center;
                   background: transparent;
                   margin-bottom: r(5px);
                   i{
                       font-size: r(30px);
                       color: $b8;
                       vertical-align: middle;
                   }
               }
            }
        }
        /*登录跳转*/
        .article_login{
            height: r(190px);
            font-size: r(20px);
            text-align: center;
            line-height: r(190px);
            border: 1px solid $c5;
            a{
                color: $b2;
                font-size: r(20px);
                text-decoration: underline;
            }
        }
        /*评论列表*/
        .commentList{
            button{
                display: block;
                width: r(395px);
                height: r(53px);
                background: $b2;
                color: #fff;
                font-size: r(26px);
                margin: r(15px) auto r(42px);
                vertical-align: middle;
            }
            &>p{
               color: #727171; 
               font-size: r(18px);
            }
            /*评论详情*/
            .comment{
                margin-bottom: r(27px);
                &:last-of-type{
                    margin-bottom: r(30px);
                    padding-top: r(22px);
                    border-top: 1px dashed #dcd3d3;
                }
                .cHeadimg{
                    display: inline-block;
                    width: r(50px);
                    height: r(50px);
                    border-radius: 50%;
                    @include imgoverflow;
                    vertical-align: middle;
                    margin-right: r(10px);
                }
                span{
                    font-size: r(18px);
                    &:nth-of-type(even){
                        color: #b2b2b2;
                    }
                }
                .c_content{
                    &>span:first-of-type{
                        color: $c4;
                        font-size: r(22px);
                    }
                }
                .c_number{
                    font-size: r(20px);
                    color: $c4;
                    i{
                        vertical-align: middle;
                    }
                }
                /*回复详细情况*/
                .c_revert{
                    background: #f6f4f4;
                    margin-top: r(40px);
                    padding-top:r(18px) ;
                    .relist{
                        height: r(90px);
                        margin: 0 r(10px) r(20px); 
                        border-bottom: 1px dashed #dcd3d3;
                        div{
                            display: inline-block;
                            width: r(40px);
                            height: r(40px);
                            border-radius: 50%;
                            @include imgoverflow;
                            vertical-align: middle;
                            margin-left: r(15px);
                        }
                        span:nth-of-type(2){
                            display: inline-block;
                            margin-left: r(18px);
                            -webkit-line-clamp: 2;
//                          @include textover2;
                        }
                        span:last-of-type{
                            text-align: right;
                            display: block;
                            color: #b2b2b2;
                            margin-top: r(14px);
                        }
                    }
                    &>textarea{
                        display: block;
                        width: r(497px);
                        height: r(72px);
                        margin: 0 auto;
                        background: #fff;
                        resize: none;
                    }
                    &>input{
                        float: right;
                        width: r(174px);
                        height: r(45px);
                        color: #fff;
                        background: $b2;
                        margin-top: r(5px);
                        font-size: r(21px);
                        margin-bottom: r(10px);
                    }
                }
            }
        }
        .cont_bottom{
            height: r(75px);
            line-height: r(70px);
            text-align: center;
            color: #bbbbbb;
            border-top: 1px solid #bbbbbb;
        }
    }
}
